<template>
  <div id="pageHead" :class="{'page_head_opacity': opacity}">
    <!-- <p class="iconfont icon-fanhui" @click="clickBack"></p> -->
    <div class="gone"><img :src="gone"  @click="clickBack"></div>
    <slot></slot>
  </div>
</template>

<script>
export default {
  name: 'pageHead',
  data () {
    return {
      gone: require("../assets/image/gone.png"),
    };
  },
  methods: {
    clickBack () {
      this.$router.go(-1);
    }
  },
  props: [
    'opacity'
  ]
};
</script>

<style lang="scss">
  #pageHead {
    position: fixed;
    top: 0;
    left: 0;
    left: 50%;
    width: 750px;
    margin-left: -375px;
    height: 88px;
    line-height: 80px;
    font-size: 34px;
    text-align: center;
    color: #222;
    background: #f9f9f9;
    box-shadow:0px 1px 0px 0px rgba(0,0,0,0.3);
    z-index: 99;
    .gone {
      position: absolute;
      top: 10px;
      left: 0;
      width: 120px;
      height: 60px;
      img {
        // width: 100%;
        height: 65%;
      }
    }
    // .icon-fanhui {
    //   position: absolute;
    //   top: 0;
    //   left: 0;
    //   width: 120px;
    //   font-size: 40px;
    //   color: #222;
    // }
    &.page_head_opacity {
      background: none;
    }

  }
</style>
